import { DatePicker, Form, Input, InputNumber, Select } from 'antd';
import type React from 'react';

interface TradeInfoFormProps {
  isEditMode?: boolean;
}

const TradeInfoForm: React.FC<TradeInfoFormProps> = ({
  isEditMode = false,
}) => {
  return (
    <>
      {isEditMode && (
        <Form.Item label="交易ID" name="tradeID">
          <Input disabled />
        </Form.Item>
      )}
      <Form.Item
        label="卡号"
        name="cardID"
        rules={[{ required: true, message: '请输入卡号' }]}
      >
        <Input disabled={isEditMode} />
      </Form.Item>
      {isEditMode && (
        <Form.Item
          label="交易日期"
          name="tradeDate"
          rules={[{ required: true, message: '请选择交易日期' }]}
        >
          <DatePicker showTime />
        </Form.Item>
      )}
      <Form.Item
        label="交易类型"
        name="tradeType"
        rules={[{ required: true, message: '请选择交易类型' }]}
      >
        <Select>
          <Select.Option value="存入">存入</Select.Option>
          <Select.Option value="支取">支取</Select.Option>
          <Select.Option value="转出">转出</Select.Option>
          <Select.Option value="转入">转入</Select.Option>
        </Select>
      </Form.Item>
      <Form.Item
        label="交易金额"
        name="tradeMoney"
        rules={[{ required: true, message: '请输入交易金额' }]}
      >
        <InputNumber style={{ width: '100%' }} />
      </Form.Item>
      <Form.Item label="备注" name="remark">
        <Input.TextArea />
      </Form.Item>
    </>
  );
};

export default TradeInfoForm;
